<template>
	<view style="padding-bottom: 60rpx;">
		<view class="women">
			<view style="font-size: 33upx; font-weight: 550;margin-bottom: 30rpx;">关于我们</view>
			<view>
				<view class="shipin">
					<image src="../../static/gywm/uu.png" mode="aspectFill"></image>
				</view>
				<view class="jieshao">我们对家居生活充满热忱。我们的文化建立在热情、团结和一种“事必达”的态度之上。我们乐观向上，不断寻找更好的新方法，比如怎样设计一款可以进行平板包装的摇椅、怎样打造一款每个人都买得起的LED灯泡。我们的理想是为大众、顾客以及我们的员工、供应商公司的员工创造更加美好的日常生活。</view>
			</view>
			<view style="font-size: 33upx; font-weight: 550;margin: 30rpx 0;">我们的服务</view>
			<view>
				<view class="fuwu">
					<image src="../../static/gywm/w.png" mode="aspectFill"></image>
					<view class="fuwu-right">
						<view style="color: #181818;margin-bottom: 20rpx;">商业空间设计</view>
						<view style="font-size: 25upx; color: #676767;line-height: 45rpx;">公司对公业务部室内设计师的专业建议和设计，为您的办公室或任意商业空间提供灵感和创意，同事满足您的预算考虑。</view>
					</view>
				</view>
				<view class="fuwu">
					<image src="../../static/gywm/q.png" mode="aspectFill"></image>
					<view class="fuwu-right">
						<view style="color: #181818;margin-bottom: 20rpx;">送货服务</view>
						<view style="font-size: 25upx; color: #676767;line-height: 45rpx;">在这里，运费从未被加进您购买的产品，无论是在实体店还是在线上下单，我们都为您送货到指定地点，可查看线上购物配送范围。</view>
					</view>
				</view>
			</view>
			<view style="font-size: 33upx; font-weight: 550;margin: 30rpx 0;">质量保证</view>
			<view>
				<view style="margin-bottom: 20rpx;color: #6b6b6b;line-height: 45rpx;">我们对产品质量非常有信心，许多产品都涵盖在质保范围内，以下是我们的品质保证列表。</view>
				<view class="baozhen">
					<view style="margin-right: 22rpx;">
						<image style="width: 240rpx;height: 200rpx;margin: 10rpx 0;" src="../../static/gywm/t.png" mode=""></image>
						<view>卧室产品品质保证</view>
					</view>
					<view style="margin-right: 22rpx;">
						<image style="width: 240rpx;height: 200rpx;margin: 10rpx 0;" src="../../static/gywm/r.png" mode=""></image>
						<view>浴室产品品质保证</view>
					</view>
					<view style="margin-right: 22rpx;">
						<image style="width: 240rpx;height: 200rpx;margin: 10rpx 0;" src="../../static/gywm/e.png" mode=""></image>
						<view>客厅产品品质保证</view>
					</view>
				</view>
			</view>
			<view style="font-size: 33upx; font-weight: 550;margin: 30rpx 0;">一站式便捷采购工具</view>
			<view style="margin-bottom: 20rpx;color: #6b6b6b;line-height: 45rpx;">您可以一站式买齐所需要的家居用品，足不出户即可完成采购，高效便捷。</view>
		</view>
		<!-- 猜你喜欢 -->
		<!-- <view style="font-size: 32upx; font-weight: 550; margin: 40rpx 22rpx"><text>猜你喜欢</text></view> -->
			<view class="xihuan">
				<view v-for="(item,index) in goodsList" :key="item.id">
				<view class="detail-box" @tap="jump('/pages/goods/detail/index', { id: item.id })">
					<image :src="item.image" mode="aspectFill"></image>
					<view><text>{{item.title}}</text></view>
					<view style="font-size: 32upx;font-weight: 550;">￥{{item.activity_type === 'groupon' ? item.groupon_price : item.price }}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapMutations, mapActions, mapState } from 'vuex';
	export default {
		data() {
			return {
				goodsList: [],
				listParams: {
					page: 1
				},
			};
		},
		computed: {
			...mapState({
				initData: state => state.init.initData,
				template: state => state.init.templateData?.home,
				hasTemplate: state => state.init.hasTemplate,
				cartNum: state => state.cart.cartNum,
				forceOauth: state => state.user.forceOauth
			}),
			popupIndex() {
				if (this.initData.popup) {
					return this.initData.popup.content.index;
				}
			},
			info() {
				if (this.initData.info) {
					return this.initData.info;
				}
			}
		},
		created() {
			// for(let i =0;i<this.template.length;i++){
			// 	this.detail = this.template[i].content
			// 	if (this.template[i].content.id) {
			// 		this.listParams.category_id = this.template[i].content.id;
			// 		// this.getGoodsList();
			// 	}else if (this.template[i].content.ids) {
			// 		this.listParams.goods_ids = this.template[i].content.ids;
			// 	}
			// }
			this.getGoodsList();
		},
		methods:{
			// 商品列表
			getGoodsList() {
				let that = this;
				console.log("111",that.goodsList)
				that.$api('goods.lists', this.listParams).then(res => {
					if (res.code === 1) {
						that.goodsList = [...that.goodsList, ...res.data.data];
						console.log("55",res.data)
						console.log("222",that.goodsList)
					}
				});
				console.log("333",that.goodsList)
			},
		}
	}
</script>

<style lang="scss" scoped>
	.women{
		border-top: 1rpx solid #efefef;
		padding: 30rpx 22rpx;
		background-color: #FFFFFF;
		
		.shipin{
			height: 370rpx;
			width: 100%;
			background-color: #0081FF;
			
			image{
				width: 100%;
				height: 100%;
			}
		}
		.jieshao{
			line-height: 50rpx;
			margin-top: 20rpx;
			font-size: 27upx;
			color: #676767;
		}
	}
	.fuwu{
		display: flex;
		justify-content: space-between;
		margin: 65rpx 0;
		 image{
			 width: 250rpx;
			 height: 250rpx;
			 border-radius: 130rpx;
			 margin-right: 30rpx;
		 }
		 .fuwu-right{
			 width: 450rpx;
		 }
	}
	.baozhen{
		display: flex;
		width: 100%;
		overflow: auto;
		overflow-x: scroll;
	}
	// 猜你喜欢
	.xihuan{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		width: 705rpx;
		margin: 40rpx auto;
		
		.detail-box{
			width: 330rpx;
			margin-bottom: 30rpx;
			line-height: 50rpx;
			
			image{
				width: 100%;
				height: 400rpx;
				border-radius: 10rpx;
			}
		}
	}

</style>
